<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新增</title>
	<script type="text/javascript" src="/bsc/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="/bsc/static/common/bootstrap/js/bootstrap/js/bootstrap.min.js"></script>
	<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap/css/bootstrap.min.css" >
	<script type="text/javascript" src="/bsc/static/common/bootstrapvaildator/js/bootstrapValidator.min.js"></script>
	<script type="text/javascript" src="/bsc/static/common/bootstrapvaildator/js/language/zh_CN.js"></script>
	<style type="text/css">
		.q1{
			font-size:0.4cm;
			text-align: center;
		}
	</style>
</head>

<body>
<form action="" method="post" enctype="multipart/form-data" id="form1">
<div class="container">
			<table id="tb" class="table table-bordered">
				<tr>
					<td colspan="2" align="center"><font size="5px">顾客新增</font></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">头像:</td>
					<td><div class="form-group"><input type="file" class="form-control" name="file" placeholder="请选择头像" id="photo"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">手机号:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="mobile" placeholder="请输入手机号" id="mobile"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">密码:</td>
					<td><div class="form-group"><input type="password" class="form-control" name="password" placeholder="请输入密码" id="password"></div></td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">姓名:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="username" placeholder="请输入姓名" id="username"></div></td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">昵称:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="nikename" placeholder="请输入昵称" id="nikename"></div></td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">性别:</td>
					<td><div class="form-group">
					<select class="form-control" name="sex" id="sex">
					<option value="-1">请选择</option>
					<option value="1">男</option>
					<option value="2">女</option>
					<option value="3">保密</option>
					</select></div>
					</td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">店铺名称:</td>
					<td><div class="form-group">
					<select class="form-control" name="bis_Shop.shop_id" id="qdid">
					<option value="-1">请选择</option>
					<c:forEach items="${list }" var="shop">
					<option value="${shop.shop_id }">${shop.shop_name }</option>
					</c:forEach>
					</select></div>
					</td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">微信状态:</td>
					<td><div class="form-group">
					<select class="form-control" name="wechat_status" id="wechat_status">
					<option value="-1">请选择</option>
					<option value="1">未订阅</option>
					<option value="2">已订阅</option>
					<option value="3">已退订</option>
					</select></div>
					</td>
				</tr>
				<tr>
					<td class="q1"  style="padding-top: 0.3cm">QQ:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="qq" placeholder="请输入qq号码" id="qq"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">邮箱:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="email" placeholder="请输入邮箱" id="email"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">生日:</td>
					<td><div class="form-group"><input type="date" class="form-control" name="born_date" id="born_date"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">注册时间:</td>
					<td><div class="form-group"><input type="date" class="form-control" name="enroll_time" placeholder="请输入通信地址" id="enroll_time"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">通信地址:</td>
					<td><div class="form-group"><input type="text" class="form-control" name="address" placeholder="请输入通信地址" id="address"></div></td>
				</tr>
				<tr>
					<td class="q1" style="padding-top: 0.3cm">备注:</td>
					<td><div class="form-group"><textarea rows="10" cols="100" name="remark" id="remark"></textarea></div></td>
				</tr>
				<tr>
				<td></td>
				<td><div class="form-group"><button type="button" class="btn btn-success glyphicon glyphicon-plus" id="save">增加</button></div></td>
				</tr>
			</table>
	   </div>
	   
</form>
</body>
<script type="text/javascript">
//开始表单验证
var form = $('#form1');
$(document).ready(function() {
	form.bootstrapValidator({
		message: '输入值不合法',
		feedbackIcons: {
			valid: 'glyphicon glyphicon-ok',
			invalid: 'glyphicon glyphicon-remove',
			validating: 'glyphicon glyphicon-refresh'
		},
		fields: {
			mobile: {
				validators: {
					notEmpty: {
						message: '手机号不能为空'
					},
					regexp: {
						//regexp: "^([0-9]{11})?$",
						//regexp: /^1[3|5|8|9]{1}[0-9]{9}$/,
						//regexp:/^1[345789]\d{9}$/,
						regexp: "^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\\d{8}$",
						message: '手机号码格式错误'
					}
				}
			},
			password: {
				message: '密码无效',
				validators: {
					notEmpty: {
						message: '密码不能为空'
					},
					stringLength: {
						min: 6,
						max: 30,
						message: '用户名长度必须在6到30之间'
					},
				}
			},
			username: {
				message: '姓名不合法',
				validators: {
					notEmpty: {
						message: '姓名不能为空'
					},
					stringLength: {
						min: 2,
						max: 30,
						message: '请输入2到30个字符'
					},
					regexp: {
						regexp: /^[a-zA-Z0-9_\. \u4e00-\u9fa5 ]+$/,
						message: '姓名只能由字母、数字、点、下划线和汉字组成 '
					}
				}
			},
			nikename: {
				message: '姓名不合法',
				validators: {
					notEmpty: {
						message: '姓名不能为空'
					},
					stringLength: {
						min: 2,
						max: 30,
						message: '请输入2到30个字符'
					},
					regexp: {
						regexp: /^[a-zA-Z0-9_\. \u4e00-\u9fa5 ]+$/,
						message: '姓名只能由字母、数字、点、下划线和汉字组成 '
					}
				}
			},
			qq: {
				message: 'qq账号格式不正确',
				validators: {
					notEmpty: {
						message: 'qq账号不能为空'
					},
					stringLength: {
						min: 2,
						max: 16,
						message: '请输入2到10个字符'
					},
					regexp: {
						regexp:  /[1-9]\d*/,
						message: 'qq账号只能由数字组成'
					}
				}
			},
			email: {
				message: '邮箱不合法',
				validators: {
					notEmpty: {
						message: '邮箱不能为空'
					},
					regexp: {
						regexp: /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
						message: '只能由数字组成'
					}
					
				}
			},
		}
	});
	//点击保存按钮进行 表单验证 
	//验证成功 提交表单 刷新界面
	$("#save").click(
		function() {
			console.log("---");
			//进行表单验证
			var bv = form.data('bootstrapValidator');
			bv.validate();
			if(bv.isValid()) {
				document.forms[0].action="/bsc/users/save";
				document.forms[0].submit();
			}
		}		
	);
	
});
</script>
</html>